import VueRouter from "vue-router";
import Home from '../pages/Home.vue'
import About from '../pages/About.vue'
import News from '../pages/News.vue'
import Message from '../pages/Message.vue'
import Detail from '../pages/Detail.vue'

const router = new VueRouter({
  routes: [
    {
      name:'home',
      path: '/home',
      meta:{tit:'首页'},
      component: Home,
      children: [
        {
          name:'news',
          path: 'news',
          component: News,
          meta:{isAuth:true,tit:'新闻'},
          beforeEnter( to,from,next ) {
            // 独享路由守卫
          }
        },
        {
          name:'message',
          path: 'message',
          meta:{isAuth:true,tit:'消息'},
          component: Message,
          children: [
            {
              name:'detail',
              path: 'detail',
              meta:{isAuth:true,tit:'详情'},
              component: Detail,
              props($route) {
                return {
                  id: $route.query.id,
		              title: $route.query.title,
                }
              }
            }
          ]
        },
      ]
    },
    {
      name:'about',
      path:'/about',
      meta:{tit:'关于'},
      component:About
    }
  ]
})
// 全局前置守卫
router.beforeEach((to,from,next)=>{
  console.log(to.name);
  if(to.meta.isAuth) {
    if(localStorage.getItem('userName') === 'admin') {
      next()
    }else {
      alert('权限校验失败')
    }
    // next()
  }else {
    next()
  }
  
})
// 全局后置守卫
router.afterEach((to,from)=>{
   document.title = to.meta.tit || '硅谷系统'
})

export default router